<!-- created by sunshine-lin in 2018.10.10 -->
<template>
  <div class="comBox"
       id="mock">
    mock
    <el-button type="primary"
               size="default"
               @click="btnClick">按钮</el-button>
    <el-button type="primary"
               size="default"
               @click="printClick">print</el-button>
    <div id="printTable">

      <table border="0" style="text-align: center;font-size: 16px;font-family: '宋体';font-weight: 700;margin-top: 50px"
             cellspacing="0"
             cellpadding="5px"
             width="100%"  v-for="x in 10">
        <!-- <caption style="font-size: 20px;line-height: 3em;font-weight: 700;">雅晴学习第{{x}}周计划</caption> -->
        <!-- <thead  style="text-align: center;">
          <tr>
            <th v-for="item in  ['一','二','三','四','五','六','日']"
                style="padding: 5px;">星期{{item}}</th>
          </tr>
        </thead> -->
        <tbody>
          <tr>
            <th v-for="i in 3"
                style="padding: 5px;">
              <div v-for="item in  ['作业','口算','写字','背诵','试卷','预习','跳绳']" style="margin: 10px 0">
                <el-checkbox style="font-size: 20px;color: #000;font-family: '宋体';font-weight: 700">{{item}}</el-checkbox>
              </div>

            </th>
          </tr>
        </tbody>

      </table>

    </div>
  </div>
</template>

<script>
// 使用 Mock
var Mock = require('mockjs')
Mock.setup({
  timeout: '1000'
})
export default {
  name: 'mock',
  data() {
    return {}
  },
  created() {
  },
  mounted() {
  },
  activated() {


    // 占位符 Basic 以下 都是
    Mock.mock('/api/getData', {
      // 属性 list 的值是一个数组，其中含有 1 到 10 个元素
      'list|10': [{
        // 属性 id 是一个自增数，起始值为 1，每次增 1
        'id|1-6.3': 1,
        // Basic
        'boolean': true,
        'natural': '@natural(10,50)',
        'integer': '@integer(100,1000)',
        'float': '@float(10,290,2,3)',
        'character': '@character(upper)',
        'string': '@string(7,8)',
        'range': '@range(1,9,2)',
        'date': '@date(yy-MM-dd)',
        'time': '@time(yyyy-MM-dd A)',
        'datetime': '@datetime',
        'now': '@now',
        // Image
        'image': '@image',
        // 'dataImage': '@dataImage',
        // Color
        'color': '@color',
        // Text
        'cparagraph': '@cparagraph',
        'csentence': '@csentence',
        'cword': '@cword',
        'ctitle': '@ctitle',
        // Name
        'cname': '@cname',
        // Web
        url: '@url',
        domain: '@domain',
        email: '@email',
        ip: '@ip',
        tld: '@tld',
        // Address
        region: '@region',
        addr: `@province@city(true)@county(true)`
      }]
    })
    var obj = Mock.mock({
      // 属性 list 的值是一个数组，其中含有 1 到 10 个元素
      'obj|10': {
        // 属性 id 是一个自增数，起始值为 1，每次增 1
        'id|1-6.3': 1,
        'name': '@cname',
        'boolean|1': true,
      }
    })
    // 输出结果
    // console.log(JSON.stringify(data, null, 4))
    // console.log(JSON.stringify(obj, null, 4))
  },
  deactivated() {
  },
  watch: {},
  methods: {
    btnClick() {
      this.axios.get('/getData').then(res => {
        console.log('res', res)
      })
    },
    printClick() {
      window.print()
      // $("#printTable").printArea();
    },
  }
}
</script>

<style rel="stylesheet" lang="scss">
#mock {
}
</style>
